<template>
  <div class="hello">
    <div style="text-align: left; margin: 20px;">
      <h1>恭喜，登录成功！</h1>
      <el-button type="primary">按钮哈</el-button>
    </div>
    

    <div>
      <div v-for="one in tableArr" :key="one.name" style="width: 48%; margin-left: 2%; float:left; border: 1px solid red;">
        <el-table-demo :tableData="one.data"></el-table-demo>
      </div>
    </div>
  </div>
</template>

<script>


import elTableDemo from "./el-table-demo.vue";
export default {
  name: "HelloWorld",
  components: {
    elTableDemo,
  },
  props: {
    msg: String,
  },
  data() {
    return {
      tableArr: [
        {
          name: "表格1",
          data: [
            {
              date: "2016-05-03",
              name: "王小虎",
              address: "上海市普陀区金沙江路 1518 弄",
            },
            {
              date: "2016-05-02",
              name: "王小虎",
              address: "上海市普陀区金沙江路 1518 弄",
            },
            {
              date: "2016-05-04",
              name: "王小虎",
              address: "上海市普陀区金沙江路 1518 弄",
            }
          ],
        },
        {
          name: "表格22222",
          data: [
            {
              date: "2016-05-03",
              name: "王小虎",
              address: "上海市普陀区金沙江路 1518 弄",
            },
            {
              date: "2016-05-02",
              name: "王小虎",
              address: "上海市普陀区金沙江路 1518 弄",
            },
            {
              date: "2016-05-04",
              name: "王小虎",
              address: "上海市普陀区金沙江路 1518 弄",
            }
          ],
        },
      ],
      arr: [
        {
          name: "one",
          data: []
        },
        {
          name: "two",
          data: []
        },
        {
          name: "three",
          data: []
        }
      ]
    };
  },
  methods:{
    changeArray(){
      let newObj = {
        name: 'three',
        data: []
      }
      this.arr.push(newObj)
    },
    changeArray2(){
      let lastOne = this.arr.length-1;
      let newObj = this.arr[lastOne]
      // 深拷贝
      newObj = JSON.parse(JSON.stringify(newObj))
      newObj.data = selectData; // 选中数据
      this.arr.splice(lastOne, 1, newObj) // 替换
    }
  },
  
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style>
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
</style>
